<template>
  <div class="httpReadTimeout-warp">
    <h2>超时配置</h2>
    <el-form :rules="rules" :model="formInline" ref="ruleForm" label-width="160px">
      <el-form-item label="HTTP连接超时时间" prop="httpConnectTimeout">
        <el-input size="small" style="width: 300px" v-model="formInline.httpConnectTimeout" placeholder="1-99"></el-input>
      </el-form-item>
      <el-form-item label="连接池获取连接的超时" prop="httpConnectionRequestTimeout">
        <el-input size="small" style="width: 300px" v-model="formInline.httpConnectionRequestTimeout" placeholder="1-999"></el-input>
      </el-form-item>
      <el-form-item label="读取数据超时时间" prop="httpReadTimeout">
        <el-input size="small" style="width: 300px" v-model="formInline.httpReadTimeout" placeholder="1-999"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" size="small" @click="onSubmit">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
  export default {
    name: "History",
    data() {
      return {
        formInline: {
          httpConnectTimeout: '',
          httpConnectionRequestTimeout:'',
          httpReadTimeout:''
        },
        rules: {
          httpConnectTimeout: [
            { required: true, message: '请输入HTTP连接超时时间', trigger: 'blur' },
            { pattern: /^([1-9]\d?|99)$/, message: '输入值为(1-99)，不允许输入空格等特殊符号' },
          ]
        }
      }
    },
    created() {
      this.$http.get('/config').then(res => {
        this.formInline.httpConnectTimeout = res.httpConnectTimeout;
        this.formInline.httpConnectionRequestTimeout = res.httpConnectionRequestTimeout;
        this.formInline.httpReadTimeout=res.httpReadTimeout
      })
    },
    methods: {
      onSubmit() {
        this.$refs["ruleForm"].validate((valid) => {
          if (valid) {
            this.$http.post("/config", {
              httpConnectTimeout: this.formInline.httpConnectTimeout,
              httpConnectionRequestTimeout: this.formInline.httpConnectionRequestTimeout,
              httpReadTimeout:this.formInline.httpReadTimeout,
              id: 1
            }).then(res => {
              this.$notify.success('保存成功')
            })
          }
        });
      }
    }
  }
</script>

<style scoped lang="less">
  .httpReadTimeout-warp {
    box-sizing: border-box;
    height: 100%;
    h2 {
      margin-bottom: 15px;
      margin-left: 18px;
    }
  }
</style>
